import type { FC } from 'react';
import IconText from '../iconText';
import FontAwesome from '@expo/vector-icons/FontAwesome';
import { primaryColor } from '@/constants/Colors';

type FavoriteProps = {
  favorite?: boolean;
  total: number;
  large?: boolean;
}

const Favorite: FC<FavoriteProps> = (props) => {
  const {
    total,
    large = false,
    favorite = false
  } = props;

  const color = large ? '#454545' : '#999';

  return (
    <IconText
      fontColor={color}
      iconWidth={large ? 24 : 20}
      fontSize={large ? 15 : 13}
      text={total.toString()}
    >
      <FontAwesome
        size={large ? 24 : 20}
        name={favorite ? 'star' : 'star-o'}
        color={favorite ? primaryColor : color}
      />
    </IconText>
  );
}

export default Favorite;